<template>
  <div id="app">
    <!-- 登录 -->
    <el-container style="min-height: 100vh; padding: 0">
      <!-- 头部 -->
      <el-header style="height: 42px; padding: 0">
        <HomeTop :userName="userName"></HomeTop>
      </el-header>
      <el-container>
        <!-- 侧栏 -->
        <el-aside width="201px" v-if="isLogin">
          <HomeMenu></HomeMenu>
        </el-aside>
        <!-- 内容 -->
        <el-container>
          <el-main class="page_box" style="padding: 20px 18px" v-if="isLogin">
            <router-view />
          </el-main>
          <el-main style="padding: 0" v-else>
            <router-view />
          </el-main>
          <el-footer style="padding: 0; height: auto">
            <div class="page_footer">
              <!-- <div class="page_footer_content" style="margin-bottom: 10px">
                版权所有：上海宜会信息技术有限公司
              </div> -->
              <a
                class="page_footer_content_a"
                href="https://www.beian.gov.cn/portal/registerSystemInfo?recordcode=31010402002521"
                target="_blank"
              >
                <div class="page_footer_content" style="cursor: pointer">
                  沪ICP备09078737号-10
                  <img
                    class="page_footer_content_icon"
                    src="./assets/image/beian_logo.png"
                  />
                  沪公网安备31010402002521号
                </div>
              </a>
            </div>
          </el-footer>
        </el-container>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import HomeTop from "@/components/homeTop.vue";
import HomeMenu from "@/components/homeMenu.vue";

export default {
  components: {
    HomeTop,
    HomeMenu,
  },
  data() {
    return {
      isLogin: false, // 是否登录
      userName: "",
    };
  },
  created: function () {
    this.isLogin = this.$store.state.loginToken ? true : false;
    this.userName = this.$store.state.loginUserName;
    this.getLevelListFn();
  },
  methods: {
    getLevelListFn: function () {
      let that = this;
      let url = "/mobile/levelText";
      let data = {};
      this.axios
        .post(url, data)
        .then((response) => {
          if (response.code == 0) {
            let list = [];
            response.level_list.forEach(function (item) {
              let obj = {
                key: item.level,
                value: item.title,
              };
              list.push(obj);
            });
            that.$store.commit("set_levelList", list);
          } else {
            that.$message.error(response.msg);
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
  },
  computed: {
    listenLogin() {
      return this.$store.state.loginToken;
    },
    listenLoginName() {
      return this.$store.state.loginUserName;
    },
  },
  watch: {
    listenLogin: function (ov) {
      if (ov == "" || ov == undefined || ov == null) {
        this.$set(this, "isLogin", false);
      } else {
        this.$set(this, "isLogin", true);
      }
    },
    listenLoginName: function (ov) {
      this.$set(this, "userName", ov);
    },
  },
};
</script>
